<template>
  <!--  写模板的地方-->
  <div class="demo">
    <h2>学校名称:{{name}}</h2>
    <h2 class="cty">学校地址:{{ address }}</h2>
  </div>
</template>

<script>
//写数据、方法。。。。的地方

//默认暴露 用时只需要 import 名字 from 文件 就行了
export default {
  //给这个模块配置名字
  name:'vue-school',
  data() {
    return {
      name: '尚硅谷',
      address: '北京昌平'
    }
  }
}
</script>


<style scoped lang="less">
/* scoped 可以让样式在自己的作用域中 可以解决class类名的冲突 */
/* lang可以写样的语法样式 比如css(默认) less sass*/
/*写样式的地方*/
  .demo {
    background-color: orange;
    .cty {
      font-size: 40px;
    }
  }
</style>